<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Question Manager</title>
        <script type="text/javascript">  
     
            function expand(id) {
                var el=document.getElementById(id);
                if (el.style.display!="none"){
                    el.style.display="none";
                }else{
                    el.style.display="block";
                }
            }
            
        </script>  

    </head>
    <body bgcolor="white">
        <%@include file="tpl_header.jsp"%>
          <center><img src="imgs/design_questions.png" width="400px" height="90px"></center>
        <table width="100%" border="0">
            <tr>
                <td width="65%">  <%@include file="QuestionMess.jsp"%>
              
                    <table width="100%" border="0">
                        <tr>
                            <td><a href="#" onClick="expand('questiontemplate');"><img  src="imgs/expand.jpg" alt="Expand"></a>Base Question Template:</td>
                        </tr>
                    </table>
                    <div id="questiontemplate" style="display:block">  
                        <form id="Main1" action="QuestionMan.jsp" method=post>
                            <p>
                              <label title="Please choose topic of this question.">Topic:</label> <select name="qqtype" title="Topic of this question. The processing of each topic is different with various question generator made by other groups. ">
                                <%
                                Category preSelectedTopic =null;
                                if(request.getAttribute("selectedTopic")!=null){
                                	preSelectedTopic = (Category)request.getAttribute("selectedTopic");
                                }
                                  List<Category> clist = n.getCategoryAll();
                                  if(clist!=null){
                                	  for(Category c:clist){
                                %>
                                    <option value=<%=c.getId()%> <%if(preSelectedTopic==null) { if(c.getId()==Integer.parseInt(n.getQQtype())){%> selected <%} }else{if(preSelectedTopic.getId()==c.getId()){%>selected<%}}%>>Grade <%=c.getGrade()%> - <%=c.getTopic()%></option>
                               <% }}%>
                                </select>  
                            </p>
                            <p>
                            <%
                            int diffLevel = n.getDiffLevel();
                            %>
                           <label title="Please Set Difficulty Level of this question.">Difficulty Level:</label> <input name="diffLevel" type="radio" value="0" <%if (diffLevel==Constant.Q_SIMPLE_DIFF_LEVEL) {%> checked="checked" <%}%>/>Simple<input name="diffLevel" type="radio" value="1" <%if (diffLevel==Constant.Q_MODERATE_DIFF_LEVEL) {%> checked="checked" <%}%>/>Moderate<input name="diffLevel" type="radio" value="2" <%if (diffLevel==Constant.Q_DIFFICULT_DIFF_LEVEL) {%> checked="checked" <%}%>/>Difficult
                            </p>
                            <p>
                           <label title="Maintain variables for $Obj and $Per.">Variable Management:</label>&nbsp;<a href="ObjListController" title="Variable Manager">Variable Manager for $Obj and $Per</a>
                           
                            </p>
                            <div><textarea name=question rows="5" cols="80" ><%=nonull(n.getQuestion0())%></textarea><label style="vertical-align: bottom;font-size: 0.825em;color: blue" title="Input a normal question, click 'Auto Generate Variables' to transform it into a template. Or you can modify your variables manually (i.e. change the numbers to be randomized to 'var_int1','var_int2', and so on, then click 'Auto Generate Variables' button to generate template.">[Help?]</label></div>
                            <p>
                                <!--<input name="submit" type=submit title="Scan for 'var_int1','var_int2', and so on. You can modify them manually after this step, then click 'Init Variable' again to update" value="Init Variables" onClick="return confirm('Sure? Unsaved variable definition, relations, solutions for this question will be lost!')"> 
                                -->
                                <a title="Enter New Questions. All fields will be cleared."><input name="submit" type=submit  value="Reset" onClick="return confirm('Are you sure to Reset? Unsaved changes will be lost!')"></a>
                                <a  title="To update only the template (i.e. some words). E.g. You make a typo when typing the question in. Correct it and click this button."><input name="submit" type=submit value="Upd Question"></a>                                                  
                                <!--                            
                                                            <INPUT TYPE="BUTTON" VALUE="Dictionary Manager" ONCLICK="window.location.href='QContentMan.jsp'"> 
                                                            <INPUT TYPE="BUTTON" VALUE="Sub Template Manager" ONCLICK="window.location.href='QStructMan.jsp'"><p><p>-->
                        </form>
                    </div>
                  

                </td>                                      
                <%@include file="QuestionPreview.jsp" %>
            </tr>
        </table>
        <table>
            <tr>            
                <%if (!n.getHint().equals("no hint")) {%>
            <font color="red"><%=n.getHint()%></font><br>
            <%}%>
            </tr>
        </table>
        <table width="100%" border="0">                                                        
            <tr>
                <td><a href="#" onClick="expand('DBquestionlist');"><img src="imgs/expand.jpg" alt="Expand"></a>List of Questions: 
                </td> 
            </tr>
        </table>
        <div id="DBquestionlist" style="display:block">
            <%@include file="QuestionList.jsp"%> 
        </div>  
      <p>
    <table border="0" align="center">
<tr>
<td><a href="TopicListController"><img src="imgs/backToPrevious.png" width="400px" height="80px"/></a></td>
<td><a href="ReviewQuestions.jsp"><img src="imgs/reviewQuestionAndSolution.png" width="400px" height="80px"/></a></td>
</tr>
</table>

        <%@include file="tpl_footer.jsp"%>
    </body>

    <script>
        $("select").change(function () {
            var str = "Topic: ";
            $("select option:selected").each(function () {
                str += $(this).text() + " ";
            });
          $("#MesBoard").text(str);
        })
        .change();

        jQuery(function() {
            //hj: validation, no empty string should be allowed.
            function validateRow(tr) {
                var valid = true;
        
                tr.find('input[type="text"]').each(function(i, el) {
                    if (!el.value.replace(' ', '')) return valid = false;
                });        
                tr.find('input[type="submit"]').attr('disabled', valid? false : true);
            }

            jQuery('tr').find('input').change(function() {
                validateRow(jQuery(this).closest('tr'));
            });
        });
    </script>

</html>
